import React from 'react';
import { Input, Button, List } from 'antd'


const TodoListUi = props => {
  return (
    <div>
      <div>
        <Input value={props.inputValue} style={{ width: '250px' }} onChange={props.changeInputValue}></Input> <Button onClick={props.clickBtn} type='primary'>添加</Button>
      </div>
      <div style={{ width: '400px' }}>
        <List bordered dataSource={props.list} renderItem={(item, index) => (<List.Item onClick={() => { props.deleteItem(index) }}>{item.name}</List.Item>)}></List>
      </div>
    </div >
  );
}

export default TodoListUi;